<template>
  <el-dialog
    title="添加至样本库"
    :visible.sync="ybkOuterVisible"
    class="list-dialog"
  >
    <el-form
      :model="ybkRuleForm"
      ref="ybkRuleForm"
      label-width="96px"
      class="list-ruleForm"
    >
      <el-form-item label="选择样本库：">
        <el-select
          v-model="ybkRuleForm.address"
          placeholder="请选择"
          @change="markOptionchange"
        >
          <el-option
            class="list-select"
            v-for="item in markOption"
            :key="item.value"
            :label="item.name"
            :value="item.value"
          >
          </el-option>
        </el-select>

        <el-select
          v-model="ybkRuleForm.address2"
          placeholder="请选择"
          style="margin-left: 15px"
          @change="markOptionChildchange"
        >
          <el-option
            class="list-select"
            v-for="item in markOptionChild"
            :key="item.value"
            :label="item.name"
            :value="item.value"
          >
          </el-option>
        </el-select>

        <el-button
          type="text"
          class="list-ruleForm-add"
          @click="ybkInnerVisible = true"
          >+新建</el-button
        >
      </el-form-item>
    </el-form>
    <el-dialog
      width="40%"
      title="新建样本库"
      :visible.sync="ybkInnerVisible"
      append-to-body
    >
      <el-form
        :model="ybkAddRuleForm"
        ref="ybkForm"
        label-width="96px"
        class="list-ruleForm"
      >
        <el-form-item label="样本库名称：">
          <el-input
            v-model="ybkAddRuleForm.name"
            placeholder="请输入内容"
          ></el-input>
        </el-form-item>
        <el-form-item label="样本库类型：">
          <el-select
            v-model="ybkAddRuleForm.type"
            placeholder="请选择"
            @change="markOptionchange1"
          >
            <el-option
              class="list-select"
              v-for="item in markOption2"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注：">
          <el-input
            type="textarea"
            :rows="2"
            placeholder="请输入内容"
            v-model="ybkAddRuleForm.notes"
          >
          </el-input>
        </el-form-item>
      </el-form>
      <el-button @click="ybkInnerVisible = false">取 消</el-button>
      <el-button type="primary" @click="ybkInner">确 定</el-button>
    </el-dialog>
    <div slot="footer" class="dialog-footer">
      <el-button @click="ybkOuterVisible = false">取 消</el-button>
      <el-button type="primary" @click="ybkOuter">提 交</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { bankList, smpleAdd, bankAdd } from "@api/sampleBank/index";
export default {
  name: "markOuter",
  props: {
    markOption: {
      type: Array
    },
    list: {
      type: Array
    },
    checkedList: {
      type: Array
    },
    dataSource: {
      type: String
    }
  },
  data() {
    return {
      ybkOuterVisible: false,
      // 新建样本库
      ybkAddRuleForm: {
        name: "",
        type: "",
        notes: ""
      },
      // 添加至样本库
      ybkRuleForm: {
        address: "",
        address2: "",
        id: "",
        id2: "",
        id3: ""
      },
      markOptionChild: [
        // {
        //   value: "1",
        //   label: "案由"
        // },
        // {
        //   value: "2",
        //   label: "决定的理由"
        // },
        // {
        //   value: "3",
        //   label: "决定"
        // }
      ],
      ybkInnerVisible: false,
      markOption2: [
        {
          value: "ktz",
          name: "课题组样本库"
        },
        {
          value: "gr",
          name: "个人样本库"
        }
      ]
    };
  },
  created() {},
  methods: {
    clearybkAddRuleFormData() {
      (this.ybkAddRuleForm.name = ""),
        (this.ybkAddRuleForm.type = ""),
        (this.ybkAddRuleForm.notes = "");
    },
    clearybkRuleFormData() {
      this.ybkRuleForm.address = "";
      this.ybkRuleForm.address2 = "";
    },
    markOptionchange(item) {
      console.log(item);
      let markOptionChild = "";
      this.markOption.map(function(ret) {
        if (ret.value == item) {
          markOptionChild = ret.children;
        }
      });
      this.ybkRuleForm.address2 = "";
      this.markOptionChild = markOptionChild;
    },
    markOptionChildchange(item) {
      console.log(item);
      this.ybkRuleForm.id2 = item;
    },
    markOptionchange1(item) {
      this.ybkRuleForm.id3 = item;
      console.log(item);
    },
    async ybkInner() {
      //备注
      var param = {
        // yangbenkmc: this.addRuleForm.name,
        jiankusm: this.ybkAddRuleForm.notes,
        yangbenlx: this.ybkRuleForm.id3
      };
      console.log(param);
      let that = this;
      try {
        const { code, data, msg } = await bankAdd(param);
        if (code == 200) {
          if (msg == "succeed") {
            console.log("1111");
            this.$message({
              showClose: true,
              message: "已添加",
              type: "success"
            });
            that.clearybkAddRuleFormData();
            // this.ybkbnt();
          }
        }
      } catch (error) {
        console.log(error);
      }

      this.ybkInnerVisible = false;
    },
    async ybkOuter() {
      let _this = this;
      let data = {
        yangbenkid: this.ybkRuleForm.address2,
        juedingh: "",
        anjianbh: "",
        shenqingh: "",
        anjianlx: ""
      };
      this.list.map(function(ret) {
        if (ret["申请号"] == _this.checkedList[0]) {
          console.log(ret["决定号"]);
          data["yangbenkid"] = ret["样本库id"]; // DLJ 20210903 MODIFY
          data["juedingh"] = ret["决定号"];
          data["anjianbh"] = ret["案件编号"]; // DLJ 20210903 MODIFY
          data["shenqingh"] = ret["申请号"];
          data["anjianlx"] = _this.dataSource;
        }
      });
      try {
        const { code, msg } = await smpleAdd(data);
        if (code == 200) {
          console.log(msg);
          if (msg == "succeed") {
            this.$message({
              showClose: true,
              message: "已添加",
              type: "success"
            });
            this.clearybkRuleFormData();
            this.$parent.getList();
          }
        }
      } catch (error) {
        console.log(error);
      }
      this.ybkOuterVisible = false;
    }
  }
};
</script>
